<template>
    <el-dialog :title="dialogText" :visible="true" width="60%" center :lock-scroll="true" 
        :close-on-press-escape="false" :close-on-click-modal="false" @close="cancel">
        <el-form ref="form" label-width="160px">
            <el-form-item label="企业名称" required>
                <el-input v-model="formData.enterpriseName" />
            </el-form-item>
            <el-form-item label="证书名称" required>
                <el-input v-model="formData.certificateTypeName" />
            </el-form-item>
            <el-form-item label="证书编号" required>
                <el-input v-model="formData.certificateNumber" />
            </el-form-item>
            <el-form-item label="级别">
                <el-input v-model="formData.nationalLevel" />
            </el-form-item>
            <el-form-item label="证书有效开始时间">
                <el-date-picker v-model="formData.validityStartDate" type="datetime" format="yyyy-MM-dd">
                </el-date-picker>
            </el-form-item>
            <el-form-item label="证书有效截至时间">
                <el-date-picker v-model="formData.validityEndDate" type="datetime" format="yyyy-MM-dd">
                </el-date-picker>
            </el-form-item>
        </el-form>
        <span slot="footer">
            <el-button @click="cancel">取消</el-button>
            <el-button type="primary" @click="handleSubmit">保存证书</el-button>
        </span>
    </el-dialog>
</template>

<script>

export default {

    data() {
        return {
            formData: {
                enterpriseName: "",
                certificateTypeName: "",
                nationalLevel: "",
                certificateNumber: "",
                certificateLevel: "",
                validityStartDate: "",
                validityEndDate: "",
            },
            dialogText: "添加证书",
        }
    },



    methods: {

        init(type, row) {
            this.dialogVisibleType = type;
            if (type === "edit") {
                this.dialogText = "编辑证书"
                this.formData = {
                    ...this.formData,
                    ...row,
                };
            }

        },


        async handleSubmit() {

            const { enterpriseName, certificateTypeName, certificateNumber, validityStartDate, validityEndDate } = this.formData;

            const rules = [
                {
                    case: !enterpriseName,
                    message: "请填写企业名称",
                },
                {
                    case: !certificateTypeName,
                    message: "请填写证书名称",
                },
                {
                    case: !certificateNumber,
                    message: "请填写证书编号",
                },
                {
                    case: !validityStartDate,
                    message: "请设置证书有效开始时间",
                },
                {
                    case: !validityEndDate,
                    message: "请设置证书有效结束时间",
                },
                {
                    case: Number(validityStartDate) > Number(validityEndDate),
                    message: "证书时间设置有误，有效开始时间不能大于结束时间",
                },
            ]

            const valid = this.$validForm(rules)

            if (!valid) {
                return
            }



            const url = this.dialogVisibleType === "edit" ? `/api/enterprise-certificates/update` : "/api/enterprise-certificates/create"
            const res = await this.$fetch.post(url, {
                ...this.formData,
            });

            if (res.code === 0) {
                this.$message.success("添加证书成功");
                this.cancel();
            }
        },

        cancel() {
            this.$emit("update:visible", false);
            this.$emit("refresh")
        },

    }
}
</script>



<style lang="less" scoped></style>